<!--  -->
<template>
  <div id="home">
    <nav-bar class="home-nav">
      <div slot="center">购物街</div>
    </nav-bar>
    <home-swiper :banners="banners"></home-swiper>
    <recommend-view :recommends="recommends"/>
    <feature-view/>
    <tab-bar-contorl :titles="['流行','新款','精选']"/>
     Lorem ipsum dolor sit, amet consectetur adipisicing elit. 
      Aut aspernatur quas ea expedita repellat deleniti reiciendis s
      int nulla facilis maiores labore reprehenderit, quasi, fugit molestiae recusandae atque cumque doloremque provident!
  </div>
</template>

<script>
// import NavBar from 'componets/common/narbar/NavBar'
import NavBar from '../../components/common/navbar/NavBar.vue'

import {getHomeMultidata} from '../../network/home'
import FeatureView from './childComps/FeatureView.vue'
import HomeSwiper from './childComps/HomeSwiper.vue'
import RecommendView from './childComps/RecommendView.vue'
import TabBarContorl from './childComps/TabBarContorl.vue'

export default {
  data () {
    return {
      banners:[],
      recommends:[],
      
    }
  },
  components:{
    NavBar,
    HomeSwiper,
    RecommendView,
    FeatureView,
    TabBarContorl,
  },
  created() {

    getHomeMultidata().then(res =>{
      console.log(res);
      this.banners = res.data.banner.list
      this.recommends = res.data.recommend.list
    })
  },
}

</script>

<style scoped>
  .home-nav{
    color: white;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5;
    overflow: hidden;
  }
</style>
